<template>
    <!-- Table -->
  <div><el-button type="text"   @click="dialogTable" >批量添加</el-button>
  <el-dialog title="选项内容" :visible.sync="dialogTableVisible" width="30%" append-to-body="true">
     <el-input   type="textarea" :rows="5" v-model="msg" placeholder="请输入内容"></el-input>
     <el-button @click="dialogTableVisible = false">取 消</el-button>
    <el-button type="primary" @click="confirm">确 定</el-button>
  </el-dialog>
  </div>
</template>

<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
import { Emit, Prop, Watch } from 'vue-property-decorator';

@Component
export default class BathAdd extends Vue {
     public $name: string = 'BatchAddComponent';
     // 接受父组件的value
     @Prop()
     public value = '';
     //接收子组件
     @Prop()
     public itemnamearry="123";

     public msg = '';
     private dialogTableVisible = false;


     constructor() {
         super();
        
         
     }

     @Watch('value')
     public change(): void {
        this.msg = this.value;
     }
     @Watch("itemnamearry")
     getoption(){
        this.msg=this.itemnamearry;
     }

     dialogTable(){
        this.$emit('getitem')
        this.dialogTableVisible =true;
     }
     public confirm() {
        this. dialogTableVisible = false;
        this.$emit('input', this.msg);
     }

}
</script>
<style>

</style>
